import { getToken, setToken, removeToken } from '@/utils/auth'
import { login, getUserInfo, getUserDetailById } from '@/api/user'
// import { login } from '@/api/user'
import {setTimeStamp} from '@/utils/auth'
// 引入导出方法
import {resetRouter} from '@/router'
// 状态
const state = {
  token: getToken(), // 设置token为共享状态 初始化vuex的时候 就先从缓存中读取
  userInfo: {}//定义一个空对象不是null 因为后边我要开发userInfo的属性给别人用  userInfo.name
}
// 修改状态
// }> serInfo为什么我们不设置为null，而是设置为 {} 
// **`getters`**中引用userinfo的变量，如果设置为null，则会引起异常和报错
const mutations = {
  // 设置token
  setToken(state, token) {
    // 1.vuex处理token
    state.token = token // 设置token  只是修改state的数据  123 =》 1234
    // 2，vuex的持久化
    setToken(token) // vuex和 缓存数据的同步
  },
  // 删除缓存
  removeToken(state) {
    state.token = null// 删除vuex的token,赋值为null
    removeToken() // 先清除 vuex  再清除缓存 vuex和 缓存数据的同步
  },
  // 设置用户信息
  setUserInfo(state, userInfo) {
    // 更新一个对象
    state.userInfo = userInfo//这样是响应式
    // state.userInfo={...result} 这也是响应式  浅拷贝
  },
  // 删除用户信息
  removeUserInfo(state) {
    state.userInfo = {}
  }
}

const actions = {
  // 定义login action  也需要参数 调用action时 传递过来的参数
  // async 标记的函数其实就是一个异步函数 -> 本质是还是 一个promise
  async login(context, data) {
    // 调用api接口
    // / 经过响应拦截器的处理之后 这里的result实际上就是 token
    const result = await login(data)
    // 实际上就是一个promise  result就是执行的结果
    // axios默认给数据加了一层data
    // 表示登录接口调用成功 也就是意味着你的用户名和密码是正确的
    // 现在有用户token
    // actions 修改state 必须通过mutations
    // axios默认加了一层data
    // 如果为true，表示登陆成功
    // context类似于this.$store
    context.commit('setToken', result)
    // 写入时间戳
    setTimeStamp() // 将当前的最新时间写入缓存
  },
  // 获取用户资料
  async getUserInfo(context) {
    const result = await getUserInfo() // result就是用户的基本资料
    const baseInfo = await
      //获取用户资料
      getUserDetailById(result.userId) // 为了获取头像
    //  合并两次请求
    const baseResult = { ...result, ...baseInfo } // 将两个接口结果合并
    // 此时已经获取到了用户的基本资料 迫不得已 为了头像再次调用一个接口
    context.commit('setUserInfo', baseResult)// 提交mutations
    return baseResult
    //return 是给后期权限做基础
  },
  // 实现登出功能
  // 登出的action
  logout(context) {
    // 类似于this.$store
    // 删除token  
    context.commit('removeToken')//删除vuex中的也删除缓存中的
    context.commit('removeUserInfo')//将用户信息删除
    resetRouter()//重置路由
    // 设置权限模块下路由为初始
    // vuex子模块调用子模块actions  都没加锁 可以随意调用 
    // 因为不加命名空间情况下 所有mutations和actions是挂载在全局 可以直接调用
    // 加了命名空间的子模块调用另一个命名空间的mutations
    // 加了命名的context指的不是全局的context
    // 第一个参数mutations名称 载荷 payload 
    // root：true 表示context指的是父级 
    context.commit('peimission/setRouter',[],{root:true})
    // 重置路由
    // 思路  删除vuex里面的routes
    // 调用permission模块的serRouter就可以
            //  解除路由合并
  }
}
export default {
  namespaced: true,
  state,
  mutations,
  actions
}

